<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>

    <script>
        function validateUsernameGet(){
            var username=document.getElementById("username").value;

            var xmlHttpRequest=new XMLHttpRequest();


            //注册事件，当xmlHttpRequest状态改变时
            xmlHttpRequest.onreadystatechange=function(){
                //当服务器已经响应结束处理
                if(xmlHttpRequest.readyState==4){
                    //当服务器响应状态码时200时做成功处理
                    if(xmlHttpRequest.status==200){
                        //获得响应数据
                        var result=xmlHttpRequest.responseText;
                        document.getElementById("validateUsernameMessage").innerHTML=result;
                    }else{
                        document.getElementById("validateUsernameMessage").innerHTML="访问的组件错误";
                    }
                }else{
                    document.getElementById("validateUsernameMessage").innerHTML="正在校验...";
                }
            };

            //准备请求信息
            xmlHttpRequest.open("get","${pageContext.request.contextPath}/validateUsername?username="+username,true);

            //发送请求
            xmlHttpRequest.send(null);


        }

        function validateUsernamePost(){
            var username=document.getElementById("username").value;

            var xmlHttpRequest=new XMLHttpRequest();


            //注册事件，当xmlHttpRequest状态改变时
            xmlHttpRequest.onreadystatechange=function(){
                //当服务器已经响应结束处理
                if(xmlHttpRequest.readyState==4){
                    //当服务器响应状态码时200时做成功处理
                    if(xmlHttpRequest.status==200){
                        //获得响应数据
                        var result=xmlHttpRequest.responseText;
                        document.getElementById("validateUsernameMessage").innerHTML=result;
                    }else{
                        document.getElementById("validateUsernameMessage").innerHTML="访问的组件错误";
                    }
                }else{
                    document.getElementById("validateUsernameMessage").innerHTML="正在校验...";
                }
            };

            //准备请求信息
            xmlHttpRequest.open("post","${pageContext.request.contextPath}/validateUsername",true);

            //设置请求头
            xmlHttpRequest.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

            //发送请求
            xmlHttpRequest.send("username="+username);
        }
    </script>


</head>
<body>
    <form action="${pageContext.request.contextPath}/regist" method="post">
      用户名：<input id="username" type="text" name="username" onblur="validateUsernamePost()"/><span id="validateUsernameMessage"></span><br/>
      密码：<input type="password" name="password"/><br/>
      电话：<input type="text" name="phone"/><br/>
      <input type="submit" value="注册"/>
    </form>

    ${message}
</body>
</html>
